<template>
    <div>
        <Tabcomponent></Tabcomponent>
        <PersonalItem>
            <div class="facorite">
                <div>{{$t('langs.Centers.like.title')}}</div>
                <div>
                    <div v-for="(item,index) in 5" :key='index'>
                        <img src="../assets/img/0FB.png" alt="">
                        <p style=" margin-top: 15px;">VERSACE</p>
                        <p>UNNU 泡泡袖连衣裙</p>
                        <p>￥8, 000</p>
                        <button>{{$t('langs.Centers.like.but')}}</button>
                        <i class="iconfont icon-zan1-copy"></i>
                    </div>
                </div>
            </div>
        </PersonalItem>
    </div>
</template>

<script>
import Tabcomponent from '@/components/Tabcomponent.vue'//头部导航
import PersonalItem from '@/components/PersonalItem.vue'
export default {
    components: {
        Tabcomponent,
        PersonalItem
    },
}
</script>

<style lang='scss'>
.facorite {
    >div:nth-child(1) {
        font-size: 36px;
    }
    >div:nth-child(2) {
        margin-top: 60px;
        overflow: hidden;
        >div {
            float: left;
            padding-bottom: 101px;
            margin-right: 56px;
            position: relative;
            >img {
                width: 197px;
                height: 197px;
                vertical-align: top;
            }
            >p {
                font-size: 14px;
                padding-left: 22px;
                line-height: 30px;
            }
            >button {
                width: 250px;
                height: 44px;
                background: #fff;
                font-size: 14px;
                border: 1px solid #000;
                cursor: pointer;
                outline: none;
                margin-top: 49px;
            }
            >i {
                font-size: 18px;
                color: #c6c6c6;
                position: absolute;
                right: 52px;
                top: 10px;
            }
        }
    }
}
</style>